<template>
<div id="index">
  <el-carousel :interval="2000" type="card"  >
    <el-carousel-item v-for="item in 4" :key="item" style="width: 100%">
      <h3 class="medium" >{{ item }}</h3>
    </el-carousel-item>
  </el-carousel>
  <el-container style="height: 500px; border: 1px solid #eee">
    <el-header style="background-color: rgba(64,255,96,0.3);
    padding-bottom: 10px;
    height: 3px;">
    </el-header>
    <el-container>
      <el-main style="height: 440px">
        <el-timeline>
          <el-timeline-item timestamp="2018/4/12" placement="top">
            <el-card>
              <h4>停车场免费洗车</h4>
              <p>进入停车场1小时即可免费洗车</p>
            </el-card>
          </el-timeline-item>
          <el-timeline-item timestamp="2018/4/3" placement="top">
            <el-card>
              <h4>停车场vip车位</h4>
              <p>现开通vip车位3元一小时</p>
            </el-card>
          </el-timeline-item>
          <el-timeline-item timestamp="2018/4/2" placement="top">
            <el-card>
              <h4>停车收费的公告</h4>
              <p>现停车场特价车位2元一小时</p>
            </el-card>
          </el-timeline-item>
        </el-timeline>
      </el-main>
    </el-container>
  </el-container>
</div>
</template>

<script>
export default {
  name: "index",
  props:{
    email:null,
  }
}
</script>

<style scoped>

  .el-carousel__item h3 {
  color: #475669;
  font-size: 14px;
  opacity: 0.75;
  line-height: 200px;
  margin: 0;

}
  .el-header {

  }

  .el-aside {
    color: #333;
  }
  #index{
    width: 100%;
    height:100%;
  }
  .el-carousel__item:nth-child(2n) {
    background: url("../assets/1.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 50% 50%;
  }
  .el-carousel__item:nth-child(2n-1) {
    background: url("../assets/1.jpeg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 50% 50%;
  }

</style>